<template>
    <div>
        <!-- 这个需要父组件向子组件传值，谁用谁向轮播图传值，接受过来的listData在props中定义后调用 -->
         <mt-swipe :auto="4000">
            <mt-swipe-item v-for="item in listData" :key="item.id"><img :src="item.img" :class="{width: isfull}"></mt-swipe-item>
            <!-- <mt-swipe-item>2</mt-swipe-item>
            <mt-swipe-item>3</mt-swipe-item> -->
        </mt-swipe>
    </div>
</template>

<script>
    export default {
        // 接收到父组件传过来的之后,先定义之后才能用
        props: ['listData','isfull']
    }

</script>

<style lang="scss" scoped>
    .mint-swipe{
        height: 200px;
        text-align: center;
            .mint-swipe-item {
                img {
                    // width: 100%;
                    height: 100%;
                }
            }
            
     }
     //在这里定义宽度为100%,然后再上面表达式判断，isfull为true则应用这个属性，如果isfull为false则不用这个属性
    .width {
        width: 100%;
    }
</style>